<template>
	<page-meta :page-style="themeColor"></page-meta>
	<view class="body">
		<view class="topHead" :style="{ backgroundImage : 'url(' + $util.img('public/uniapp/jielong/banyuan.png') + ')' }">
			<view class="jielong-head">
				<view class="countdown" v-if="status==0">
					距活动开始仅剩：
					<uni-count-down
						:day="time.d"
						:hour="time.h"
						:minute="time.i"
						:second="time.s"
						color="#fff"
						splitorColor="#FF4644"
						backgroundColor="#FF4644"
					/>
				</view>
				<view class="countdown" v-else-if="status ==1">
					距活动结束仅剩：
					<uni-count-down
						:day="time.d"
						:hour="time.h"
						:minute="time.i"
						:second="time.s"
						color="#fff"
						splitorColor="#FF4644"
						backgroundColor="#FF4644"
					/>
				</view>
				<view class="countdown" v-else-if="status==2">
					活动已结束
				</view>
				<view class="countdown" v-else-if="status==3">
					活动已关闭
				</view>
			</view>
			
			<!-- 活动介绍 -->
			<view class="move-info">
				<view class="move-title">
					{{jielong_info.jielong_name}}
				</view>
				<view class="move-detail">
					{{jielong_info.desc}}
				</view>
			</view>
		</view>

		
		<!-- 商品内容 -->
		<view class="marketimg-box-con">
			<view class="marketimg-box-con-item">
				<view class="wrap" v-for="(item, index) in jielong_list" :key="index">
					<view class="img-box">
						<image :src="goodsImg(item.goods_image)"></image>
					</view>
					<view class="content">
						<view class="title">{{item.goods_name}}</view>
						<view class="title-text" v-if="item.introduction">{{item.introduction}}</view>
						<view class="title-text" v-else>精品好物，购物多多，等你来抢</view>
						<view class="content-num" v-if="item.member_headimg.length > 0">
							<view class="content-num-image">
								<image :src="$util.img(data) ? $util.img(data) : $util.getDefaultImage().head" mode="" v-for="(data,value) in item.member_headimg.slice(0,3)" :key="value"></image>
							</view>
							<text :class=" item.member_num==2 ? 'text-left' : ''" v-if="item.member_num<3">{{item.member_num}}人已买</text>
							<text class="text-leftThree" v-else>...等{{item.member_num}}人已买</text>
						</view>
						<view class="content-die">
							<text>￥{{item.discount_price}}</text>
							<text>￥{{item.market_price}}</text>
						</view>
						<view class="content-bnutton">
							<view v-if="item.goods_spec_format && status!=2" @click="codeView(item.sku_id)" class="color-base-bg">
								选规格
								<view class="color-base-bg-num" v-if="item.cart_num!=0 && token!=''">
									{{item.cart_num}}
								</view>
							</view>
							<view v-else-if="item.goods_spec_format && status==2" class="color-base-bg color-base-bgHover">选规格</view>
							<block v-else>
								<view class="content-bnutton-body" v-if="data.sku_id==item.sku_id"  v-for="(data,value) in shoplist"  :key="value"  >
									<view class="content-bnutton-sum iconfont icon-jianshao content-bnutton-left" @click="singleSkuReduce(item)"></view>
									<view class="content-bnutton-center" >
										{{data.num}} 
									</view>
								</view>
								<view v-if="status!=2" class="content-bnutton-sum iconfont icon-add-fill content-bnutton-right" @click="singleSkuPlus(item)"></view>
								<view v-else class="content-bnutton-sum iconfont icon-add-fill content-bnutton-right content-bnutton-rightNew"></view>
							</block>
						</view>
					</view>
				</view>
			</view>
		</view>

		<view class="old-buy old-buy-one" v-if="jielong_buy_page.count == 0">
			<view class="head">
				<image :src="$util.img('public/uniapp/jielong/left.png')" mode=""></image>
				<text class="old-buy-head-text">他们都在买</text>
				<image :src="$util.img('public/uniapp/jielong/right.png')" mode=""></image>    
			</view>
			<view class="content">
				<image :src="$util.img('public/uniapp/jielong/wuren.png')" mode=""></image>
			</view>
			<view class="old-buy-die">
				暂无购买记录
			</view>
		</view>

		<view class="old-buy" v-else>
			<view class="head">
				<image :src="$util.img('public/uniapp/jielong/left.png')" mode=""></image>
				<text class="old-buy-head-text">他们都在买</text>
				<image :src="$util.img('public/uniapp/jielong/right.png')" mode=""></image>
			</view>
			<view :class="seeMores ? 'old-buy-head-content' : ''"> 
				<view class="content" v-for="(item, index) in (jielong_buy_page.list || '').slice(0,cutting)" :key="index">
					<view style="display: flex;">
						<view class="old-buy-content">
							<image class="old-buy-content-image" :src="item.headimg=='' ? $util.getDefaultImage().head : $util.img(item.headimg)"></image>
							<view class="old-buy-content-right">
								<view class="old-buy-top">
									<view class="nickname">
										{{item.nickname}}
									</view>
									<view class="buy-goods">
										{{ $util.timeStampTurnTime(item.pay_time)}}
									</view>
								</view>
								<view class="buy-goods">
									购买了{{item.order_name}}
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="see-more" @click="seeMore" v-if="seeMores && jielong_buy_page.count>5">
				查看更多
			</view>
			<view class="see-more" @click="seeMore" v-else-if="jielong_buy_page.count>5">
				收起更多
			</view>
		</view>
		
		<view :class="zIndex ? 'cart-bottom zIndex' : 'cart-bottom'" >
			<view class="cart-bottom-content">
				<view class="cart-bottom-gouwu" @click="CartPopup">
					<view :class="status==1 && shoplist.length>0 ? 'cart-bottom-gouwu-content iconhover' : 'cart-bottom-gouwu-content'" >
						<view class="cart-bottom-gouwu-content-sum"  v-if="status==1 && shoplist.length>0">{{num}}</view>
						<text class="iconfont icon-ziyuan1 "></text>
					</view>
				</view>
				<view class="cart-bottom-text" v-if="shoplist.length==0">
					暂未选购商品
				</view>
				<view class="cart-bottom-textTow" v-else>
					<text>￥</text>{{money}}
				</view>
			</view>
			<view class="cart-gouwu-tijiao cart-gouwu-tijiaohover" v-if="status==0">
				活动未开始
			</view>
			<view :class="status==1 && shoplist.length>0 ? 'cart-gouwu-tijiao ' : 'cart-gouwu-tijiao cart-gouwu-tijiaohover'" v-if="status==1" @click="settlement">
				接龙购买
			</view>
			<view class="cart-gouwu-tijiao cart-gouwu-tijiaohover" v-if="status==2">
				活动已结束
			</view>
			<view class="cart-gouwu-tijiao cart-gouwu-tijiaohover" v-if="status==3">
				活动已关闭
			</view>
		</view>
		
        <view class="shoping-fixed">
			<view class="shoping-fixed-content" @click="share">
				<text class="iconfont icon-fenxiang4"></text>
				<view class="shoping-fixed-content-text">
					分享
				</view>
			</view>
			<view class="shoping-fixed-content" @click="order">
				<text class="iconfont icon-dingdan2"></text>
				<view class="shoping-fixed-content-text">
					订单
				</view>
			</view>
		</view>		
		<uni-popup ref="cartPopup" type="bottom" class="cart-popup" style="margin-bottom: 100rpx;">
			<view class="popup-shop">
				<view class="cart-shop-title">
					<view class="cart-shop-title-left">
						已选商品<text>（共{{num}}件）</text>
					</view>
					<view class="cart-shop-title-right">
						<text class="iconfont icon-icon7"></text>
						<text @click='delect'>清空</text>
					</view>
				</view>
				<view class="cart-contentOne" v-if="returnShoping.length==0">
					<image :src="$util.img('public/uniapp/jielong/wurenOne.png')" mode=""></image>
				</view>
				<view class="popup-content-shop" v-else>
					<view class="wrap" v-for="(item, index) in returnShoping" :key="index">
						<view class="img-box">
							<image :src="bottomImage(item.sku_image) ? item.sku_image : $util.img(item.sku_image)"></image>
						</view>
						<view class="content">
							<view class="title">{{item.goods_name}}</view>
							<view class="title-text">规格：{{item.sku_name}}</view>
							<view class="content-die">
								<text>{{item.discount_price}}</text>
								<text>￥{{item.market_price}}</text>
							</view>
							<view class="content-bnutton">
								<block>
									<view class="content-bnutton-body" v-if="data.sku_id==item.sku_id"  v-for="(data,value) in shoplist"  :key="value"  >
										<view class="content-bnutton-sum iconfont icon-jianshao content-bnutton-left" @click="singleSkuReduce(item)"></view>
										<view class="content-bnutton-center" >
											{{data.num}} 
										</view>
									</view>
									<view class="content-bnutton-sum iconfont icon-add-fill content-bnutton-right" @click="singleSkuPlus(item)"></view>
								</block>
							</view>
						</view>
					</view>
				</view>
			</view>
		</uni-popup>
		
		<uni-popup ref="erWeiPopup" type="center" :mask-click="false">
			<view class="popupContent" >
				<view class="popupContent-top" >
					<view class="popupContent-top-title" >
						<view class="popupContent-top-title-left">
							<image :src="switchImage ? specifications.sku_image : $util.img(specifications.sku_image) " mode=""></image>
						</view>
						<view class="popupContent-top-title-right">
							<view class="popupContent-top-title-right-textTop">
								{{specifications.sku_name}}
							</view>
							<view class="popupContent-top-title-right-textBottom" v-if="specifications.stock_show">
								库存{{specifications.stock}}件
							</view>
						</view>
					</view>
					<view class="popupContent-top-center">
						<view class="popupContent-top-center-content" v-for="(items,indexs) in specificationsItem" :key="indexs">
							<view class="popupContent-top-center-content-text">
								{{items.spec_name}}
							</view>
							<view class="popupContent-top-center-content-small" >
								<view @click="switchs(item.sku_id)" :class="specifications.sku_id == item.sku_id ? 'small-content small-content-hover' : 'small-content'" v-for="(item,i) in items.value" :key="i">
									{{item.spec_value_name}}
								</view>
							</view>
						</view>
					</view>
				    <view class="popupContent-top-bottom" >
				    	已选择：<text>{{specifications.title}}</text>
						<view class="popupContent-top-bottom-content">
							<view class="popupContent-top-bottom-content-left">
								<text>￥</text><text>{{specifications.discount_price}}</text>
							</view>
							<view v-if="display" class="popupContent-top-bottom-content-sum">
								<view class="content-bnutton-sum iconfont icon-jianshao content-bnutton-left" @click="singleSkuReduce(specifications)"></view>
								<view v-if="item.sku_id==specifications.sku_id" class="content-bnutton-center" v-for="(item,index) in shoplist" :key="index">
									{{item.num}}
								</view>
								<view class="content-bnutton-sum iconfont icon-add-fill content-bnutton-right" @click="singleSkuPlus(specifications)"></view>
							</view>
							<view v-else >
								<button type="primary" class="popupContent-top-bottom-content-right" v-if="specifications.stock && specifications.stock != 0" @click="shoppingCart(specifications)">加入购物车</button>
								<button type="primary" class="popupContent-top-bottom-content-right" disabled="true" v-else>确定</button>
							</view>
							
						</view>
				    </view>
				</view>
				<view class="popupContent-bottom">
					<text class="iconfont iconfont-delete icon-close-guanbi" @click="close"></text>
				</view>
			</view>
		</uni-popup>

		<uni-popup ref="share" type="center" class="share-img">
			<view class="share-image" >
				<image :src="$util.img(shareImage)" mode=""></image>
			</view>
		</uni-popup>
		
		
		<ns-login ref="login"></ns-login>
		
		<view class="fixed-left" v-if="horseRace">
			<view class="fixed-left-content">
				<image :src="lantern.headimg=='' ? $util.getDefaultImage().head : $util.img(lantern.headimg)"></image>
				<view class="fixed-left-content-text">
					{{lantern.content}}刚刚下单成功
				</view>
			</view>
		</view>
		<loading-cover ref="loadingCover"></loading-cover>
	</view>
</template>



<script>
	import uniPopup from '@/components/uni-popup/uni-popup.vue';
	
	export default {
		data() {
			return {
				jielong_id: '',
				jielong_info: {},
				jielong_list: [{
					goods_image:'',
					member_headimg:[]
				}],
				jielong_buy_page: {},
				time: '',
				timer: '',
				//底部选择选择详情
				selsectDetails:[],
				num:"",//件数
				money:0,//金额数
				specifications:{},// 选规格弹窗内容
				specificationsItem:[{
					spec_name:'',
					spec_value_name:'',
					value:[{
							sku_id:'',
							spec_value_name:""
						}]
				}],//规格尺寸、颜色列表
				index:0,//规格尺寸、颜色选择
				zIndex:true,//弹出层层级判断
				addshop:[],// 添加商品
				shoplist:[],//商品列表
				display:false,//加减添加显示判断
				returnShoping:[],// 返回购物车列表
				shareImage:"",//点击分享后返回的图片
				switchImage:false, // 切换弹窗图片拼接判断
				seeMores:true,// 点击查看更多
				status:"",//判断活动是否开始结束等
				cutting:5,//初始显示数量
				horseRace:true,//判断跑马灯是否显示
				//轮播图判断
				lantern:{},//跑马当当前数据
				token:"",//登录
				//分享建立上下级所需id
				memberId:0,
				//分享时详情所用图片
				shareImg:''
			};
		},
		components: {
			uniPopup,
		},
		onLoad(option) {
			this.jielong_id = option.jielong_id;
			if (option.scene) {
				var sceneParams = decodeURIComponent(option.scene);
				sceneParams = sceneParams.split('&');
				if (sceneParams.length) {
					sceneParams.forEach(item => {
						if (item.indexOf('jielong_id') != -1) this.jielong_id = item.split('-')[1];
					});
				}
			}
			
			//获取memberId
			this.$util.getMemberId().then(resolve=>{
				this.memberId = resolve;
			}).catch((reject)=>{
				// #ifdef MP-WEIXIN
				console.log('reject',reject)
				// #endif
			})
			//小程序分享接收source_member
			if (option.source_member){
				uni.setStorageSync('source_member', option.source_member);
			}
			// 小程序扫码进入，接收source_member
			if (option.scene) {
				var sceneParams = decodeURIComponent(option.scene);
				sceneParams = sceneParams.split('&');
				if (sceneParams.length) {
					sceneParams.forEach(item => {
						if (item.indexOf('sku_id') != -1) this.skuId = item.split('-')[1];
						if (item.indexOf('m') != -1) uni.setStorageSync('source_member', item.split('-')[1]);
						if (item.indexOf('is_test') != -1) uni.setStorageSync('is_test', 1);
					});
				}
			}
			
			this.token=uni.getStorageSync('token')
			this.getJielongDetail()
			this.getJielongBuyPage()
			this.shopList()
			this.openCartPopup()
		},
		onshow(){
			//记录分享关系
			if(uni.getStorageSync('token') && uni.getStorageSync('source_member')){
				this.$util.onSourceMember(uni.getStorageSync('source_member'));
			}
		},
		/**
		 * 转发分享
		 */
		onShareAppMessage(res) {
			var title = this.jielong_info.jielong_name;
			let route = this.$util.getCurrentShareRoute(this.memberId);
			var path = route.path;
			return {
				title: title,
				path: path,
				imageUrl: '',
				success: res => {},
				fail: res => {}
			};
		},
		// 分享到微信朋友圈
		onShareTimeline() {
			let route = this.$util.getCurrentShareRoute(this.memberId);
			let query = route.query;
			return {
				title: this.jielong_info.jielong_name,
				query: query,
				imageUrl: ''
			};
		},
		methods: {
			// 登录操作
			toLogin() {
				if(!uni.getStorageSync('token') && this.$refs.login){
					this.$refs.login.open('/pages_promotion/jielong/jielong?jielong_id=' + this.jielong_id);
					return true
				}
			},
			//商品渲染
			getJielongDetail() {
				this.$api.sendRequest({
					url: '/jielong/api/Goods/jielongDetail',
					data: {
						jielong_id: this.jielong_id
					},
					success: res => {
						if (res.code == 0 && res.data && res.data.info) {
							this.status=res.data.info.status
							this.jielong_info = res.data.info
							this.jielong_list = res.data.list
							this.timer = res.timestamp
							if (this.jielong_info.start_time > this.timer) {
								this.time = this.$util.countDown(this.jielong_info.start_time - this.timer)
							} else if (this.jielong_info.start_time < this.timer && this.jielong_info.end_time > this.timer) {
								this.time = this.$util.countDown(this.jielong_info.end_time - this.timer)
							}
							if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
						} else {
							this.$util.showToast({
								title: "未获取到活动信息",
							});
							setTimeout(() => {
								this.$util.redirectTo('/pages/index/index');
							}, 1000);
						}
					},
				})
			},
			// 获取购买人员列表
			getJielongBuyPage() {
				this.$api.sendRequest({
					url: '/jielong/api/Goods/jielongBuyPage',
					data: {
						jielong_id: this.jielong_id
					},
					success: res => {
						if (res.code == 0 && res.data) {
							this.jielong_buy_page = res.data
							if(this.jielong_buy_page.list.length>0){
								this.horseRace=true
								this.running()
							}else{
								this.horseRace=false
							}
						}
					},
				})
			},

			goodsImg(imgStr) {
				let imgs = imgStr.split(',');
				return imgs[0] ? this.$util.img(imgs[0], {
					size: 'mid'
				}) : this.$util.getDefaultImage().goods;
			},

			// 获取商品详情
			async getGoodsSkuDetail(skuId) {
				if (!uni.getStorageSync('token')) {
					this.$refs.login.open(this.currentRoute);
					return;
				}
				
				let res = await this.$api.sendRequest({
					url: '/api/goodssku/getInfoForCategory',
					async: false,
					data: {
						sku_id: skuId,
					}
				});
				let data = res.data;
				
				if (data) {
					this.goodsSkuDetail = data;

					if (this.skuId == 0) this.skuId = this.goodsSkuDetail.sku_id;

					this.goodsSkuDetail.unit = this.goodsSkuDetail.unit || "件";

					this.goodsSkuDetail.show_price = this.goodsSkuDetail.discount_price;
					
					// 当前商品SKU规格
					if (this.goodsSkuDetail.sku_spec_format) this.goodsSkuDetail.sku_spec_format = JSON.parse(this
						.goodsSkuDetail.sku_spec_format);

					// 商品SKU格式
					if (this.goodsSkuDetail.goods_spec_format) this.goodsSkuDetail.goods_spec_format = JSON.parse(this
						.goodsSkuDetail.goods_spec_format);
				} else {
					this.$util.redirectTo('/pages/index/index');
				}
			},
			/**
			 * 结算
			 */
			settlement() {
				var data=[];
				if(this.shoplist.length==0) return false
				this.shoplist.forEach(item=>{
					data.push(item.cart_id)
				});
				data=data.toString()
				this.$util.redirectTo('/pages/order/payment');
				uni.setStorage({
					key: 'orderCreateData',
					data: {
						cart_ids:data,
						jielong_id:this.jielong_id
					},
					success: () => {
						this.$util.redirectTo('/pages/order/payment');
					}
				});
			},
			// 打开弹出层
			CartPopup(){
				if(this.toLogin()){
					this.toLogin()
					return false
				} 
				this.$refs.cartPopup.open();
				this.openCartPopup()
			},
			// 获取购物车列表
			openCartPopup() {
				this.$api.sendRequest({
					url: '/jielong/api/cart/goodsLists',
					data: {
						jielong_id: this.jielong_id,
					},
					success: res => {
						this.num=0
						this.money=0
						let data=res.data;

						if(data.length > 0){
							data.forEach(item=>{
								this.num=parseInt(item.num)+this.num
								this.money=(parseInt(item.price)*parseInt(item.num))+this.money
							})
						}

						this.returnShoping=data
					},
				})
			},
			
			// 关闭优惠券弹出层
			closeCartPopup() {
				this.$refs.cartPopup.close();
			},
			
			// 减
			singleSkuReduce(item){
				var sku_id=item.sku_id;
				this.shoplist.forEach(item=>{
					if(sku_id==item.sku_id && item.num>1){
						var num=--item.num
						this.edit(item.cart_id,num);
					}else if(sku_id==item.sku_id && item.num===1){
						this.delectItem(item.cart_id)
					}
				})
				this.getJielongDetail()
			},
			
			//加
			singleSkuPlus(item){
				if(!uni.getStorageSync('token')){
					this.toLogin()
					return false
				}
				
				if(this.status==0){
					uni.showToast({
						title:'活动未开始',
						icon:"none"
					})
					return false
				}
				var sku_id=item.sku_id;
				var judge=true;
				if(this.shoplist.length==0){
					this.addShop(sku_id)
				}else{
					this.shoplist.forEach(item=>{
						if(sku_id===item.sku_id){
							var num=++item.num
							this.edit(item.cart_id,num);
							judge=false
						}
					})
					if(judge){
						this.addShop(sku_id)
					}
				}
				this.getJielongDetail()
			},
			
			// 清空
			delect(){
				if(!uni.getStorageSync('token')){
					this.toLogin()
					return false
				}
				this.$api.sendRequest({
					url: '/jielong/api/cart/clear',
					data: {
						jielong_id: this.jielong_id,
					},
					success: res => {
						this.shopList();
						this.openCartPopup();
						this.getJielongDetail()
					},
				})
			},
			
			// 打开选购弹窗
			codeView(value){
				if(!uni.getStorageSync('token')){
					this.toLogin()
					return false
				}
				
				if(this.status==0){
					uni.showToast({
						title:'活动未开始',
						icon:"none"
					})
					return false
				}
				this.switchs(value)
				this.$refs.erWeiPopup.open()
				this.zIndex=false;//控制弹窗与底部结算层级
				this.display=false;
				var _that=this
				if(this.shoplist.length==0){
					this.display=false;
				}else{
					this.shoplist.forEach(item=>{// 购物车后内部加入、或加减显示判断
						if(value==item.sku_id){
							this.display=true
						}
					})
				}
			},
			// 关闭选购弹窗 
			close(){
				this.$refs.erWeiPopup.close()
				this.zIndex=true;
			},
			// 规格切换
			switchs(sku){
				this.title=""
				this.shopList();
				this.openCartPopup();
				this.$api.sendRequest({
					url: '/api/goodssku/getInfoForCategory',
					data: {
						sku_id: sku,
					},
					success:(res)=>{
						this.specifications=res.data;
						this.specificationsItem=JSON.parse(this.specifications.goods_spec_format)
						this.specificationsItem.forEach((items)=>{
							items.value.forEach(item=>{
								if(item.sku_id==sku){
									this.title=this.title+item.spec_value_name+'/'
								}
							})
						})
						this.specifications.title=this.title
						this.switchImage=this.specifications.sku_image.includes('http')
					},
				});
				this.display=false
				this.shoplist.forEach(item=>{// 购物车后内部加入、或加减显示判断
					if(sku==item.sku_id){
						this.display=true
					}
				})
			},
			
			// 获取已选商品列表
			shopList(){
				this.toLogin()
				this.$api.sendRequest({
					url: '/jielong/api/cart/lists',
					data: {
						jielong_id: this.jielong_id,
					},
					success: res => {
						this.shoplist=res.data;
						
					},
				})
			},
			// 添加购物车商品
			addShop(sku){
				this.$api.sendRequest({
					url: '/jielong/api/cart/add',
					data: {
						jielong_id: this.jielong_id,
						num:1,
						sku_id:sku,
					},
					success: res => {
						this.addshop=res.data;
						this.shopList();
						this.openCartPopup();
						this.getJielongDetail();
						if(res.code == -1) {
							this.$util.showToast({
								title: res.message
							});
							return
						}
					},
				})
			},
			// 编辑购物车
			edit(cret,num){
				this.$api.sendRequest({
					url: '/jielong/api/cart/edit',
					data: {
						jielong_id: this.jielong_id,
						num:num,
						cart_id:cret,
					},
					success: res => {
						this.shopList();
						this.openCartPopup();
						this.getJielongDetail()
						if(res.code == -1) {
							this.$util.showToast({
								title: res.message
							});
							return
						}
					},
				})
			},
			
			// 删除购物车
			delectItem(cret){
				this.$api.sendRequest({
					url: '/jielong/api/cart/delete',
					data: {
						num:0,
						cart_id:cret,
					},
					success: res => {
						this.shopList();
						this.openCartPopup();
						this.getJielongDetail()
					},
				})
				this.display=false
			},
			// 弹窗添加购物车事件
			shoppingCart(value){
				this.display=true;
				let sku=value.sku_id;
				this.addShop(sku)
				this.openCartPopup();
				this.getJielongDetail()
			},
			
			// 分享
			share(){
				if(!uni.getStorageSync('token')){
					this.toLogin()
					return false
				}
				this.shareImage=""
				uni.showLoading({  
				    title: '加载中'
				});
				this.$refs.share.open()
				let id=JSON.stringify({
					jielong_id:this.jielong_id
				})
				this.$api.sendRequest({
					url: '/jielong/api/goods/poster',
					data: {
						page:'/pages_promotion/jielong/jielong',
						qrcode_param:id,
					},
					success: res => {
						uni.hideLoading();  
						this.shareImage=res.data.poster_path;
					},
				})
			},
			// 订单   
			order(){
				this.$util.redirectTo('/pages/order/list');
			},
			// 底部图片显示判断
			bottomImage(item){
				if(item.includes('http')){
					return true
				}else{
					return false
				}
			},
			//判断查看更多
			seeMore(){
				this.seeMores=!this.seeMores
				if(this.seeMores){
					this.cutting=5
				}else{
					this.cutting=this.jielong_buy_page.count
				}
			},
			// 跑马灯效果
			running(){
				var data=JSON.parse(JSON.stringify(this.jielong_buy_page.list)) 
				var i=1;
				var content=data[0].nickname
				content=content.slice(0,1)
				data[0].content=content+'**'
				this.lantern=data[0]
				setInterval(()=>{
					if(i<data.length){
						content=data[i].nickname
						content=content.slice(0,1)
						data[i].content=content+'**'
						this.lantern=data[i]  
						i++
					}else{
						i=0
					}
				},10000)
			},
		}
	}
</script>

<style scoped lang="scss">
	.body {
		background: #f8f8f8;
		padding-bottom: 200rpx;
	}

	*{
		font-family:PingFang-SC-Bold;
	}
	
	.topHead{
		width: 100%;
		min-height: 200rpx;
		background-repeat: no-repeat;
		background-size:100% 240rpx;
		padding: 0 30rpx;
		box-sizing: border-box;
	}
	.jielong-head {
		border-radius: 0px 0px 50rpx 40rpx;
		width:100%;
		margin-bottom: 30rpx;
		.countdown {
			display: flex;
			align-items: center;
			justify-content: center;
			padding-top: 30rpx;
			color: #fff;
		}

		text {
			padding: 6rpx;
			margin: 15rpx;
			border-radius: 6rpx;
			background: #fff;
			color: #ff4544;
		}
	}

	.move-info {
		background: #fff;
		margin: 0 auto;
		padding: 20rpx;
		box-sizing: border-box;
		border-radius: 15rpx;
		width:100%;
		.move-title {
			font-size: 30rpx;
			font-weight: 600;
		}
		.move-detail {
			font-size: 26rpx;
			color: #B3B3B3;
			display: -webkit-box;
			-webkit-line-clamp:3;
			overflow: hidden;
			text-overflow: ellipsis;
			-webkit-box-orient: vertical;
		}
	}
	// 商品列表
	.marketimg-box-con {
		background: #fff;
		margin: 30rpx 30rpx 0 30rpx;
		border-radius: 15rpx;
		
	}
.wrap {
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 10rpx;
			border-bottom: 1rpx solid #eee;
			padding: 10px;
			box-sizing: border-box;
			.img-box {
				width: 190rpx;
				height: 190rpx;
				flex-shrink: 0;
				margin-right: 18rpx;
				border-radius: 10rpx;
				overflow: hidden;

				image {
					width: 100%;
					height: 100%;
				}
			}

			.content {
				height: 100%;
				display: flex;
				flex-direction: column;
				justify-content: space-between;
				min-height: 190rpx;
				width: 420rpx;
				position: relative;
				.title{
					font-size:28rpx;
					 font-weight:bold;
					 text-overflow: -o-ellipsis-lastline;
					  overflow: hidden;
					  text-overflow: ellipsis;
					  display: -webkit-box;
					  -webkit-line-clamp: 2;
					  line-clamp: 2;
					  -webkit-box-orient: vertical;
					
				}
				.title-text{
					color:#B3B3B3;
					font-size: 24rpx;
					display: -webkit-box;
					-webkit-line-clamp:1;
					overflow: hidden;
					text-overflow: ellipsis;
					-webkit-box-orient: vertical;
					margin-bottom: 8rpx;
				}
				.content-num{
					display: flex;
					align-items: center;
					font-size: 20rpx;
					.content-num-image{
						max-width: 140rpx;
						height: 48rpx;
						margin-right: 30rpx;
						position:relative;
						image{
							width: 48rpx;
							height: 48rpx;
							border-radius:50%;
						}
						image:nth-child(2){
							position:absolute;
							left:26rpx;
						}
						image:nth-child(3){
							position:absolute;
							left:52rpx;
						}
					}
					.text-left{
						margin-left:20rpx;
					}
					.text-leftThree{
						margin-left:40rpx;
						color:#B3B3B3;
					}
					.content-num-image:after{
						overflow:hidden;
						height:0;
						content:"";
						display:block;
						clear:both;
					}
					text{
						color:#B3B3B3;
					}
					
				}
				.content-die{
					max-width: 260rpx;
					overflow: hidden; //超出的文本隐藏
					text-overflow: ellipsis; //溢出用省略号显示
					white-space: nowrap; //溢出不换行
					font-size: 20rpx;
					text:nth-child(1){
						font-size:24rpx;
						color:red;
						margin-right: 10rpx;
						font-weight: bold;
					}
					text:nth-child(2){
						font-size:20rpx;
						color:#B3B3B3;
						text-decoration: line-through;
					}
				}
				.content-bnutton{
					// width: 160rpx;
					height: 50rpx;
					position: absolute;
					bottom: 0;
					right: 0;
					display: flex;
					align-items: center;
					justify-content: space-around;
					.content-bnutton-sum{
						font-size: 50rpx;
					}
					.content-bnutton-right{
						color:#ff4544;
					}
					.content-bnutton-rightNew{
						color:#B3B3B3;
					}
					.content-bnutton-left{
						color:#ff4544;
					}
					.content-bnutton-center{
						margin: 0 16rpx;
					}
					.color-base-bg{
						width: 160rpx;
						height: 50rpx;
						border-radius: $border-radius;
						color: white;
						text-align: center;
						line-height: 50rpx;
						position: relative;
						.color-base-bg-num{
							width:30rpx;
							height:30rpx;
							background:#ff4544;
							color:white;
							text-align: center;
							line-height: 30rpx;
							position: absolute;
							border-radius:50% ;
							border: 1rpx solid white;
							top:-15rpx;
							right:-15rpx;
							font-size:24rpx;
						}
					}
					.color-base-bgHover{
						background:#B3B3B3 !important;
					}
					.content-bnutton-body{
						display: flex;
						align-items: center;

					}
				}
				.bot {
					display: flex;
					justify-content: space-between;
					align-items: flex-end;
					position: relative;

					.price-box {
						display: flex;
						align-items: flex-end;
						line-height: 1;

						.seckill-price {
							font-size: 32rpx;
							margin-right: 10rpx;
							font-weight: bold;
						}

						.original-price {
							font-size: 20rpx;
							color: #B3B3B3;
							text-decoration: line-through;
						}
					}

					.iconfont {
						height: 52rpx;
						margin-left: 20rpx;
						font-size: 40rpx;
					}
				}
			}
		}
	.old-buy {
		background: #fff;
		margin: 30rpx 30rpx 0 30rpx;
		border-radius: 15rpx;
		padding: 20rpx;
		box-sizing: border-box;
		.head {
			text-align: center;
			color: #ff4544;
			font-size: 32rpx;
			font-weight: 600;
			margin-bottom: 20rpx;
			.old-buy-head-text{
				padding-top:4rpx;
			}
		}

		.see-more {
			text-align: center;
			color: #ff4544;
		}

		.content {
			color: #B3B3B3;

			image {
				width: 70rpx;
				height: 70rpx;
			}

			.nickname {
				text-align: left;
				font-weight: 600;
			}

			.buy-goods {
				font-size: 20rpx;
				color: #B3B3B3;
				overflow: hidden;
				white-space: nowrap;
				text-overflow: ellipsis;
			}
		}
	}

	.careBox_more {
		position: absolute;
		right: -80rpx;
		bottom: -50rpx;
		padding: 50rpx;
		line-height: 1;
		box-sizing: border-box;

		text {
			display: inline-block;
			width: 120rpx;
			height: 50rpx;
			line-height: 34rpx;
			text-align: center;
			color: #fff;
			padding: 8rpx;
			border-radius: 44rpx;
			box-sizing: border-box;
			font-size: $font-size-tag;
		}
	}

	.cart-bottom {
		position: fixed;
		bottom: 0;
		left:0;
		width: 100%;
		height: 120rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 30rpx;
		box-sizing: border-box;
		background:white;
		z-index: 455445;
		box-shadow: 0 0 30rpx rgba(0,0,0,.2);
		.cart-bottom-gouwu{
			width: 100rpx;
			height: 100rpx;
			background: white;
			position: relative;
			padding: 10rpx;
			border-radius:50%;
			box-sizing: border-box;
			.cart-bottom-gouwu-content{
				width: 80%;
				height: 80%;
				background:#c5c5c5;
				border-radius: 50%;
				position: absolute;
				left: 50%;
				top: 50%;
				transform: translate(-50%,-50%);
				.cart-bottom-gouwu-content-sum{
					position: relative;
					width: 40rpx;
					height: 40rpx;
					top:-10rpx;
					right: -54rpx;
					background:#FF4544;
					margin: 0;
					border-radius:50%;
					border:1rpx solid white;
					color:white;
					text-align: center;
					font-size: 24rpx;
					line-height: 40rpx;
				}
				i{
					position: absolute;
					top:50%;
					left:50%;
					transform: translate(-50%,-50%);
					font-size: 38rpx;
					color:white;
				}
			}
		}
		.cart-bottom-text{
			width: 170rpx;
			font-size: 26rpx;
			margin-left:24rpx;
			text-align: left;
		}
		.cart-bottom-textTow{
			font-size: 34rpx;
			margin-right: 232rpx;
			color: red;
			font-weight: bold;
			margin-left: 24rpx;
			text{
				font-size: 26rpx;
			}
		}
		.cart-gouwu-tijiao{
			font-size: 26rpx;
			color: white;
			width: 200rpx;
			height: 60rpx;
			text-align: center;
			line-height: 60rpx;
			background:#ff4544;
			border-radius: 60rpx;
			padding: 5rpx 0;
		}
		.cart-gouwu-tijiaohover{
			background:#B3B3B3;
		}
	}
	
	
	/deep/ .uni-countdown__number{
		color:#ff4544 !important;
		background:white !important;
		border: none;
	}
	/deep/ .uni-countdown__splitor {
    color: white !important;
}
	.popup-shop{
		width: 100%;
		padding:0 30rpx;
		box-sizing: border-box;
		.cart-shop-title{
			width: 100%;
			height:80rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			font-size: 30rpx;
			.cart-shop-title-left{
				text{
					color:#c5c5c5;
				}
			}
			.cart-shop-title-right{
				display: flex;
				align-items: center;
				text{
					color:#c5c5c5;
					margin-left: 10rpx;
				}
				i{
					font-size:26rpx;
				}
			}
		}
		.cart-content{
			max-height: 600rpx;
			overflow: auto;
			.marketimg-box-con{
				margin: 0;
				height: 100%;
				.marketimg-box-con-item{
					height: 100%;
				}
			}
		}
		.cart-contentOne{
			width: 100%;
			height: 400rpx;
			color:#c5c5c5;
			font-size: 50rpx;
			text-align: center;
			line-height: 400rpx;
			image{
				width: 420rpx;
				height:260rpx;
				margin:50rpx auto;
			}
		}
	}
	
	// 选规格弹窗
.popupContent{
	width:600rpx;
	min-height:900rpx;
	background:none;
	border-radius: 20rpx;
	overflow: hidden;
	.popupContent-top{
		width: 100%;
		height:60vh;
		background:#FFFFFF;
		border-radius:12rpx;
		.popupContent-top-title{
			width: 100%;
			height: 180rpx;
			border-bottom: 1rpx solid #c5c5c5;
			display: flex;
			padding: 30rpx;
			box-sizing: border-box;
			.popupContent-top-title-left{
				width:120rpx;
				height: 120rpx;
				border: 1rpx solid #c5c5c5;
				margin-right: 20rpx;
				border-radius:8rpx;
				overflow:hidden;
				image{
					width: 100%;
					height: 100%;
				}
			}
			.popupContent-top-title-right{
				width: 70%;
				font-size: 28rpx;
				color: #303133;
				.popupContent-top-title-right-textBottom{
					font-size: 24rpx;
					color:#c5c5c5;
					margin-top:20rpx;
				}
				.popupContent-top-title-right-textTop{
					font-size: 28rpx;
					color:#333333;
					display: -webkit-box;
					-webkit-line-clamp:1;
					overflow: hidden;
					text-overflow: ellipsis;
					-webkit-box-orient: vertical;
				}
			}
		}
		.popupContent-top-center{
			width: 100%;
			height: 440rpx;
			border-bottom: 1rpx solid #c5c5c5;
			padding:0 30rpx;
			box-sizing: border-box;
			overflow: scroll;
			.popupContent-top-center-content{
				.popupContent-top-center-content-text{
					font-weight: 400;
					padding: 10px 0;
					color:#B3B3B3;
					font-size: 24rpx;
				}
				.popupContent-top-center-content-small{
					margin-bottom: 10rpx;
					.small-content{
						text-align: center;
						position: relative;
						display: inline-block;
						border: 1px solid #eeeeee;
						padding: 0 10px;
						margin: 0 5px 10px 0;
						background-color: #fff!important;
						border-radius: 15px;
						font-size:24rpx;
					}
					.small-content-hover{
						border:2rpx solid #ff4544;
						color:#ff4544;
						box-sizing: border-box;
					}
				}
			}
		}
		.popupContent-top-bottom{ 
			width: 100%;
			height: 230rpx;
			padding: 30rpx;
			box-sizing: border-box;
			font-size: 24rpx;
			text{
				font-size: 24rpx;
				color:#c5c5c5;
			}
			text:nth-child(2){
				margin: 0 10rpx;
			}
			.popupContent-top-bottom-content{
				display: flex;
				align-items: center;
				justify-content: space-between;
				margin-top: 20rpx;
				.popupContent-top-bottom-content-left{
					padding-top:10rpx;
					text{
						color:#ff4544;
						font-size: 32rpx;
						word-wrap: break-word;
					}
				}
				.popupContent-top-bottom-content-sum{
					display: flex;
					align-items: center;
					justify-content: space-between;
					margin-top: 20rpx;
					width: 200rpx;
					height: 60rpx;
					margin:0;
					.content-bnutton-left{
						font-size: 50rpx;
						color:#ff4544;
					}
					.content-bnutton-right{
						font-size: 50rpx;
						color:#ff4544;
					}
				}
				.popupContent-top-bottom-content-right{
					width: 200rpx;
					height: 60rpx;
					border-radius: 60rpx;
					line-height: 60rpx;
					text-align: center;
				}
			}
		}
	}
	
    .popupContent-bottom{
		display: flex;
		align-items: center;
		justify-content: center;
		.iconfont-delete{
			font-size:60rpx;
			margin-top: 20rpx;
			color: white;
		}
	}
}

/deep/ .uni-popup__wrapper.uni-custom .uni-popup__wrapper-box{
	background:none;
}

	.popupContent .popupContent-top{
		height: auto;
	}
	
	/deep/ .uni-popup{
		z-index: 55455454;
	}
	/deep/ .bottom.safe-area{
		border-top-left-radius:20rpx;
		border-top-right-radius:20rpx;
	}
	
	/deep/ .uni-popup__wrapper.uni-bottom, .uni-popup__wrapper.uni-top{
		border-top-left-radius:20rpx !important;
		border-top-right-radius:20rpx !important;
	}
	
	/deep/ .uni-countdown__splitor{
		color:white;
	}
	
	.zIndex{
		z-index:99;
	}
	
	.shoping-fixed{
		position: fixed;
		width: 90rpx;
		height: 230rpx;
		right: 30rpx;
		bottom:132rpx;
		.shoping-fixed-content{
			width: 90rpx;
			height: 90rpx;
			border-radius: 50%;
			box-shadow: 0 0 30rpx rgba(0,0,0,.2);
			background:white;
			margin-bottom:20rpx;
			display: flex;
			flex-direction: column;
			justify-content: space-around;
			align-items: center;
			i{
				font-size:40rpx;
				color:#ff4544;
				line-height: 28rpx;
				margin-top: 4rpx;
			}
			.shoping-fixed-content-text{
				font-size:20rpx;
				text-align: center;
				line-height: 20rpx;
			}
		}
	}
	.share-image{
		width: 600rpx;
		height: 960rpx;
		image{
			width: 100%;
			height: 100%;
		}
	}
	.old-buy-top{
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.old-buy-content{
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		margin-bottom: 20rpx;
		.old-buy-content-right{ 
			min-width:84%;
			max-width:84%;
			padding: 0 10px; 
			box-sizing: border-box;
			height: 100%;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
		}
		.old-buy-content-image{
			width: 80rpx !important;
			height: 80rpx !important;
			border-radius: 50%;
		}
	}
	
	.old-buy-head-content{
		overflow:hidden;
	}
	
	.old-buy-one{

		.content{
			width: 420rpx;
			height: 260rpx;
			margin: 20rpx auto;
			image{
				width: 100%;
				height: 100%;
			}
		}
		.old-buy-die{
			font-size:30rpx;
			color:#B3B3B3;
			text-align: center;
		}
	}
	.head{
		display: flex;
		align-items:center;
		justify-content: space-evenly;
		image{
			width: 200rpx;
			height:40rpx
		}
	}
	
	.iconhover{
		background:#FF4544 !important;
	}
	
	/deep/ .uni-countdown__number{width:32rpx;text-align:center;}
	
	.fixed-left{
		position:fixed;
		top:120rpx;
		right:10%;
		max-width:650rpx;
		height:60rpx;
		background:rgba(0,0,0,.4);
		color:white;
		border-radius:60rpx;
		padding:0 30rpx;
		box-sizing:border-box;
		overflow: hidden;
		animation:mymove 10s infinite;
	}
	.fixed-left-content{
		display:flex;
		align-items:center;
		height: 60rpx;
		line-height: 60rpx;
		border-radius:30rpx  0 0 30rpx;
		image{
			width:50rpx;
			height:50rpx;
			border-radius: 50%;
		}
		.fixed-left-content-text{
			max-width:360rpx;
			font-size:24rpx;
			color:white;
			display: -webkit-box;
			-webkit-line-clamp:1;
			overflow: hidden;
			text-overflow: ellipsis;
			-webkit-box-orient: vertical;
			margin-left:6rpx;
		}
	}
	
	@keyframes mymove{
		0% {opacity:0;}
		10%{opacity:0;}
		50% {opacity:1;}
		80% {opacity:1;}
		100% {opacity:0;}
	}
	
	.uni-swiper{
		height: 60rpx !important;
	}
	
	.popup-content-shop{
		max-height: 600rpx;
		overflow: auto;
		padding-bottom: 60rpx;
	}
	.cart-bottom-content{
		display: flex;
		align-items: center;
	}
	.share-img .uni-popup__mask{
		z-index: 1500 !important;
	}
</style>
